/*
 * @Author: yxfan
 * @Date: 2025-01-11 18:18:12
 * @LastEditTime: 2025-01-11 18:30:46
 * @FilePath: /umi-demo/src/pages/demo/TreeDemo/index.jsx
 * @Description:
 */
import React, { useState } from 'react';
import CustomTree from '@/components/CustomTree';

const TreeDemo = () => {
    // 使用纯粹的数据结构，便于数据管理和维护
    const [treeData] = useState([
        {
            title: '根目录',
            type: 'dir',
            key: 'root',
            children: [
                {
                    title: '子目录1',
                    type: 'dir',
                    key: 'dir1',
                    children: [
                        {
                            title: '文件1',
                            type: 'file',
                            key: 'file1',
                        },
                    ],
                },
                {
                    title: '文件2',
                    type: 'file',
                    key: 'file2',
                },
            ],
        },
    ]);

    // 节点操作处理函数
    const handleDelete = (node) => {
        console.log('删除节点:', node);
    };

    const handleEdit = (node) => {
        console.log('编辑节点:', node);
    };

    const handleAdd = (node) => {
        console.log('添加节点:', node);
    };

    return (
        <div style={{ padding: 24, width: 300 }}>
            <h1>树组件示例</h1>
            <CustomTree
                treeData={treeData}
                onDelete={handleDelete}
                onEdit={handleEdit}
                onAdd={handleAdd}
            />
        </div>
    );
};

export default TreeDemo;
